<template>
  <a-card class="result-success" :bordered="false">
    <result :is-success="true" :description="msg" :title="title">
      <template slot="action">
        <a-button class="action" type="primary" @click="linkToCheckArtworks">返回审查列表</a-button>
        <a-button class="action" @click="print">打印</a-button>
      </template>
      <div>
        <div class="project-name">艺术品Id：{{artDetail.id}}</div>
        <detail-list size="small" style="max-width: 800px; margin-bottom: 8px">
          <detail-list-item term="名称">{{artDetail.title}}</detail-list-item>
          <detail-list-item term="提交时间">{{new Date().toLocaleString()}}</detail-list-item>
        </detail-list>
      </div>
    </result>
  </a-card>
</template>

<script>
import Result from '@/components/result/Result'
import DetailList from '@/components/tool/DetailList'
import {mapState} from 'vuex'

const DetailListItem = DetailList.Item
export default {
  name: 'fSuccess',
  components: { DetailListItem, DetailList, Result},
  data () {
    return {
      title: '提交成功',
      msg:""
    }
  },
  methods: {
    print () {
      window.print()
    },
    linkToCheckArtworks(){
      // 重新获取 checkartworks 的信息
      this.$store.dispatch('artworksNotAudit',{
        pageIndex:this.pageIndex,
        pageSize:this.pageSize
      })
      this.$router.push('/checkartworks')
    }
  },
  computed:{
      ...mapState({
          artDetail:store=>store.artwork.artDetail,
          pageIndex:store=>store.artwork.pageIndex,
          pageSize:store=>store.artwork.pageSize
      })
  },
  watch:{
    '$route.query.msg'(newValue){
      this.msg=newValue
    }
  },
  mounted(){
      this.msg=this.$route.query.msg
  }
}
</script>

<style scoped lang="less">
.result-success{
  .action:not(:first-child){
    margin-left: 8px;
  }
  .project-name{
    font-size: 16px;
    color: @title-color;
    font-weight: 500;
    margin-bottom: 20px;
  }
}
</style>
